import React from 'react'
import style from './style'
import Link from '../link'
import cx from 'classnames'
import util from '../../util'

function getWidth(small, big) {
  return small? 30: big? 69: 48
}

export default ({ target, width, big, small, to, className, src, name, title,rewardVO, ...others}) => (
	<div 
		className={cx({
			[className]: !!className,
			[style.root]: true,
			[style.big]: big,
			[style.small]: small
		})}>
		{
			React.createElement(Link, {
        noHover: !to,
				to,
				className: cx(style.img, { [style['has-image']]: src }),
        style: src? { 
          backgroundImage: `url(${src})`,
          ...util.crop(src, width || getWidth(small, big))
        }: {},
        icon: !src? 'avatar': '',
        target
			})
		}
    {
      (name || title)?
      <div className={style.txt}>
        {
          React.createElement(to? Link: 'p', {
            to,
            className: style.link,
            target
          }, name)
        }
        <p>{title || String.fromCharCode(160)}</p>
      </div>: null
    }
    {
      !rewardVO ? null : 
      <div className={style['reward-box']}>
        <span>赞赏了</span>
        {
          (rewardVO.rewardedUsers||[]).map((v, i) => {
            if(!v) {
              return null;
            }
            const {
              fullName: name,
              userId,
            } = v;

            return React.createElement(userId? Link: 'span', {
                to:'#/okr/objective-targetAll?userId='+userId,
                className: style.link,
                target:"_blank",
                key: i,
              }, name);
          })
        }
        {
          (rewardVO.rewardedTeams||[]).map((v, i) => {
            if(!v) {
              return null;
            }
            const {
              teamName: name,
              teamId,
            } = v;
            return React.createElement(teamId? Link: 'span', {
                to:'/#/okr?type=2&teamId='+teamId,
                className: style.link,
                target:"_blank",
                key: i,
              }, name);
          })
        }
      </div>
    }
	</div>
)
